import React from 'react'
import uuid from 'uuid'
import DataTable from '../../../share/DataTable'
import * as AlertUtil from '../../../public/js/alertUtil'
import * as FormUtil from '../../../public/js/formUtil'
import { initTable, buttonDelete, buttonEdit,checkRight } from '../../../public/js/public'

export default class PermissionList extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            tableId: uuid.v4(),
            toolbarId : uuid.v4()
        }
    
    }

    componentDidMount() {
        this.initTable()
    }

    initTable() {
        let that = this, columns = [{
            title: '权限ID',
            data: 'id'
        },{
            title: '权限名',
            data: 'name'
        }, {
            title: '权限标识',
            data: 'permission'
        }, {
            title: '修改时间',
            data: 'updateTime',
            render: function(data,type,row, meta) {
                if(data) {
                    return new Date(data).format('yyyy-MM-dd hh:mm:ss')
                }
            }
        }, {
            title : '操作',
            events : {
                'click .update' : (e, value, row) => {
                    let history = that.props.history
                    history.push('/system/permission/edit/' + row['id'])
                },
                
                'click .remove' : (e, value, row) => {
                    AlertUtil.confirm('删除提示','确定要删除吗？！',()=>{
                        let url = domainName + "/permissions/" + row.id, data = {}
                        FormUtil.getData(url, data, (response)=>{
                            AlertUtil.alert('提示','删除成功!',()=>{
                                $('#' + that.state.tableId).DataTable().ajax.reload()
                            });
                            
                        })
                    })
                },
            },
            render(data, type, row, meta) {
                let edit = buttonEdit('back:permission:update'),resetPwd = '',html = [],
                    deleteButton = buttonDelete('back:permission:delete')
                                
                html.push('<div class="button-group">')
                html.push(edit)
                html.push(deleteButton)
                html.push('</div>')
                return html.join('')
            }
        }]

        const tableConfig = {
            columns:columns,
            ajax: domainName + "/permissions/getByPage",
        }
        initTable({
            toolbarId :this.state.toolbarId,
            tableId: this.state.tableId,
            buttons : []
        },tableConfig)
    }

    renderAddBtn(){
        if(checkRight('back:permission:update')) {
            return (
                <a href="#/system/permission/edit/" className="dt-button btn btn-primary waves-effect waves-light btn-sm buttons-html5 mr-1" title="添加">
                    添加
                </a>
            )
        }
     }

    render() {
        return (
            <div>
                <DataTable>
                    <div id={this.state.toolbarId}>
                        {this.renderAddBtn()}
                    </div>
                    <table id={this.state.tableId} className="table table-striped table-bordered display"></table>
                </DataTable>
            </div>
        )
        
    }
}


